<template>
  <a-modal v-model="visible" title="创建订单" width="50%">
    <template slot="footer">
      <a-button
        style="background: #d7d7d7; color: #fff; border: none"
        @click="
          () => {
            this.visible = false;
          }
        "
        >取消</a-button
      >
      <a-button :loading="loading" type="primary" @click="onSumit"
        >保存</a-button
      >
    </template>
    <a-form-model
      ref="ruleForm"
      :model="dto"
      :rules="rules"
      :label-col="labelCol"
      :wrapper-col="wrapperCol"
    >
      <!-- //客户编号 -->
      <a-row :gutter="24">
        <a-col :span="12" v-if="port != 'client'">
          <a-form-model-item label="客户编号" prop="tenantId">
            <a-select
              v-model="dto.tenantId"
              show-search
              size="small"
              option-filter-prop="children"
              style="width: 100%"
              :filter-option="filterOption"
              @change="changeTenantId"
            >
              <a-select-option
                :value="item.tenantId"
                v-for="item in accArray"
                :key="item.id"
                :titles="item.title"
              >
                {{ item.companyName + "/" + item.tenantId }}
              </a-select-option>
            </a-select>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="仓库" prop="warehouseId">
            <a-select
              v-model="dto.warehouseName"
              style="width: 100%"
              size="small"
              show-search
              option-filter-prop="children"
              :filter-option="filterOption"
              @change="handleChangeWarehouse"
            >
              <a-select-option
                :value="item.sysStoreHouseId"
                v-for="item in warehouse"
                :key="item.sysStoreHouseId"
                :name="item.storeHouseCode"
              >
                {{ item.storeHouseCode }}
              </a-select-option>
            </a-select>
          </a-form-model-item>
        </a-col>
      </a-row>
      <!-- 发件信息 -->
      <a-card style="margin-bottom: 15px" title="发件信息" :bordered="true">
        <a-row :gutter="24">
          <a-col :span="12">
            <a-form-model-item label="公司名称" prop="fromCompanyName">
              <a-input
                :maxLength="128"
                style="width: 100%"
                size="small"
                v-model="dto.fromCompanyName"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="12"> </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :span="12">
            <a-form-model-item label="发件人姓名" prop="fromRecipient">
              <a-input
                :maxLength="128"
                style="width: 100%"
                size="small"
                v-model="dto.fromRecipient"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="电话号码" prop="fromContactPhone">
              <a-input
                :maxLength="128"
                style="width: 100%"
                size="small"
                v-model="dto.fromContactPhone"
              />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :span="12">
            <a-form-model-item label="国家" prop="fromCountryId">
              <a-select
                allowClear
                placeholder="请选择国家"
                size="small"
                show-search
                option-filter-prop="children"
                :filter-option="filterOption"
                @change="handleChangeState"
                v-model="dto.fromCountryName"
              >
                <a-select-option
                  :value="item.id"
                  v-for="item in fromState"
                  :key="item.id"
                  :name="item.name"
                >
                  {{ item.name }}
                </a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="州/市" prop="fromProvinceId">
              <a-select
                allowClear
                placeholder="请选择州/市"
                size="small"
                show-search
                option-filter-prop="children"
                :filter-option="filterOption"
                v-model="dto.fromProvinceName"
                @change="handleChangeProvince"
              >
                <a-select-option
                  :value="item.id"
                  v-for="item in fromProvince"
                  :key="item.id"
                  :name="item.name"
                >
                  {{ item.name }}
                </a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :span="12">
            <a-form-model-item label="城市" prop="fromCity">
              <a-input
                :maxLength="128"
                style="width: 100%"
                size="small"
                v-model="dto.fromCity"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="邮编" prop="fromPostalCode">
              <a-auto-complete
                size="small"
                v-model="dto.fromPostalCode"
                :data-source="FromPostalCodeDataSource"
                style="width: 100%"
                @change="onSearchFromPostalCode"
                @select="onChangeFromPostalCode"
              />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :span="12">
            <a-form-model-item label="详细地址" prop="fromFirstAddress">
              <a-textarea
                :maxLength="128"
                style="width: 100%"
                size="small"
                v-model="dto.fromFirstAddress"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="12"> </a-col>
        </a-row>
      </a-card>
      <!-- 收件信息-->
      <a-card style="margin-bottom: 15px" title="收件信息" :bordered="true">
        <a-row :gutter="24">
          <a-col :span="12">
            <a-form-model-item label="公司名称" prop="toCompanyName">
              <a-input
                :maxLength="128"
                style="width: 100%"
                size="small"
                v-model="dto.toCompanyName"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="12"> </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :span="12">
            <a-form-model-item label="收件人姓名" prop="toRecipient">
              <a-input
                :maxLength="128"
                style="width: 100%"
                size="small"
                v-model="dto.toRecipient"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="电话号码" prop="toContactPhone">
              <a-input
                :maxLength="128"
                style="width: 100%"
                size="small"
                v-model="dto.toContactPhone"
              />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :span="12">
            <a-form-model-item label="国家" prop="toCountryId">
              <a-select
                placeholder="请选择国家"
                size="small"
                show-search
                option-filter-prop="children"
                :filter-option="filterOption"
                @change="handleToChangeState"
                v-model="dto.toCountryName"
              >
                <a-select-option
                  :value="item.id"
                  v-for="item in toState"
                  :key="item.id"
                  :name="item.name"
                >
                  {{ item.name }}
                </a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="州/市" prop="toProvinceId">
              <a-select
                allowClear
                placeholder="请选择州/市"
                size="small"
                show-search
                option-filter-prop="children"
                :filter-option="filterOption"
                v-model="dto.toProvinceName"
                @change="handleChangeToProvince"
              >
                <a-select-option
                  :value="item.id"
                  v-for="item in toProvince"
                  :key="item.id"
                  :name="item.name"
                >
                  {{ item.name }}
                </a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :span="12">
            <a-form-model-item label="城市" prop="toCity">
              <a-input
                :maxLength="128"
                style="width: 100%"
                size="small"
                v-model="dto.toCity"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="邮编" prop="toPostalCode">
              <a-auto-complete
                size="small"
                v-model="dto.toPostalCode"
                :data-source="toPostalCodeDataSource"
                style="width: 100%"
                @change="onSearchtoPostalCode"
                @select="onChangetoPostalCode"
              />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :span="12">
            <a-form-model-item label="详细地址" prop="toFirstAddress">
              <a-textarea
                :maxLength="128"
                style="width: 100%"
                size="small"
                v-model="dto.toFirstAddress"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="12"> </a-col>
        </a-row>
      </a-card>
      <!-- 包裹及物流信息设置-->
      <a-card
        style="margin-bottom: 15px"
        :bordered="true"
        class="logisticsCard"
      >
        <span slot="title"
          >包裹及物流信息设置(cm/kg)
          <a-button
            size="small"
            s
            style="
              background: #66b1ff;
              color: #fff;
              border: none;
              margin-left: 8px;
              margin-right: 20px;
            "
            type="primary"
            @click="addParcel"
          >
            新增
          </a-button>
        </span>
        <a-table
          :columns="columns"
          :data-source="dto.parcelList"
          :pagination="false"
        >
          <!-- 包裹数量 -->
          <span slot="parcelNu" slot-scope="text, record">
            <a-input-number
              @change="changeParcel(record)"
              size="small"
              v-model="record.parcelNu"
              :min="1"
            />
          </span>
          <!-- 长宽高 -->
          <span slot="lengthNumber" slot-scope="text, record">
            <a-input-number
              @change="
                () => {
                  record.lengthNumber =
                    record.lengthNumber === null ? 1 : record.lengthNumber;
                }
              "
              size="small"
              v-model="record.lengthNumber"
              :min="1"
            />
            *
            <a-input-number
              @change="
                () => {
                  record.widthNumber =
                    record.widthNumber === null ? 1 : record.widthNumber;
                }
              "
              size="small"
              v-model="record.widthNumber"
              :min="1"
            />
            *
            <a-input-number
              @change="
                () => {
                  record.heightNumber =
                    record.heightNumber === null ? 1 : record.heightNumber;
                }
              "
              size="small"
              v-model="record.heightNumber"
              :min="1"
            />
          </span>
          <!-- 重量 -->
          <span slot="weightNumber" slot-scope="text, record">
            <a-input-number
              @change="
                () => {
                  record.weightNumber =
                    record.weightNumber === null ? 1 : record.weightNumber;
                }
              "
              size="small"
              v-model="record.weightNumber"
              :min="1"
            />
          </span>
          <!-- /备注 -->
          <span slot="remark" slot-scope="text, record">
            <a-textarea
              :maxLength="256"
              v-model="record.remark"
              :auto-size="{ minRows: 1 }"
            />
          </span>
          <!-- 操作 -->
          <span slot="action" slot-scope="text, record">
            <a-popconfirm
              title="确定要删除这条数据吗?"
              ok-text="确定"
              cancel-text="取消"
              @confirm="delRowData(record)"
            >
              <a
                href="javascript:;"
                style="text-decoration: underline; color: red"
                >删除
              </a>
            </a-popconfirm>
          </span>
        </a-table>

        <a-row :gutter="24">
          <a-col :span="8">
            <a-form-model-item label="物流商" prop="type">
              <a-select
                placeholder="请选择物流商"
                v-if="modalFlag != 'info'"
                size="small"
                show-search
                option-filter-prop="children"
                style="width: 10.5rem"
                @change="handleChangeLogistics"
                v-model="dto.logisticsName"
              >
                <a-select-option
                  v-for="item in logisticsArray"
                  :value="item.id"
                  :key="item.id"
                  :logisticsPlatform="item.logisticsPlatform"
                  :serviceName="item.serviceName"
                  :sysLogisticsId="item.sysLogisticsId"
                  :sysLogisticsServiceItemId="item.sysLogisticsServiceItemId"
                >
                  <a-tooltip>
                    <template slot="title">
                      {{ item.serviceName }}/{{ item.logisticsPlatform }}
                    </template>
                    {{ item.serviceName }}/{{ item.logisticsPlatform }}
                  </a-tooltip>
                </a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>
          <a-col :span="11">
            <a-form-model-item label="预定义包裹" prop="parcel">
              <a-input
                :maxLength="128"
                style="width: 100%"
                size="small"
                v-model="dto.parcel"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="5">
            <a-checkbox style="margin-top: 10px" v-model="dto.sign">
              签收服务
            </a-checkbox>
          </a-col>
        </a-row>
      </a-card>
      <!-- //备注 -->
      <p>
        <a-row :gutter="24">
          <a-col :span="24">
            <h3>备注：</h3>
            <a-textarea
              v-model="dto.remark"
              style="width: 100%"
              :auto-size="{ minRows: 3, maxRows: 5 }"
              :maxLength="256"
            />
          </a-col>
        </a-row>
      </p>
    </a-form-model>
  </a-modal>
</template>

<script>
import {
  Outbound_state,
  Outbound_Province,
  Outbounddel_carrier,
} from "@/apis/clientSide/OrderManage/Outbound";
import { getWhList } from "@/apis/common";
import { tenantService, postalCode } from "@/apis/common";
import {
  add_waybill,
  waybill_messageInfo,
  put_waybill,
} from "@/apis/system/BuyWaybill/BuyWaybill";
export default {
  props: ["getTableList", "accArray", "port"],
  async created() {
    if (sessionStorage.getItem("terminal") === "2") {
      let res = await tenantService(sessionStorage.getItem("tenantId"));
      if (res.code === "200") {
        this.logisticsArray = res.responseBody;
      }
    }
  },
  mounted() {
    this.$bus.$off("BuyWaybillModal");
    this.$bus.$on("BuyWaybillModal", async (rowData) => {
      let { code, responseBody } = await waybill_messageInfo(rowData.id);
      if (code === "200") {
        this.getState();
        this.getLogisticsList();
        if (this.$refs.ruleForm) {
          this.$refs.ruleForm.resetFields();
        }
        let res = await Outbound_Province(rowData.toCountryId);
        if (res.code === "200") {
          this.province = res.responseBody;
        }
        let rowDto = { ...responseBody };
        rowDto.sign = rowDto.sign === "1" ? true : false;
        this.dto = { ...rowDto };
        this.visible = true;
        this.modalFlag = "edit";
        this.getWhListData(rowData.tenantId);
      }
    });
    if (this.port == "client") {
      this.getWhListData(sessionStorage.getItem("tenantId"));
    }
  },
  data() {
    return {
      modalFlag: "",
      //物流商
      logisticsList: [],
      tableList: [],
      labelCol: { span: 8 },
      wrapperCol: { span: 14 },
      loading: false,
      visible: false,
      warehousingId: [],
      dto: {
        //发件公司名称
        fromCompanyName: null,
        //发件人联系电话
        fromContactPhone: null,
        //国家ID
        fromCountryId: null,
        //国家名称
        fromCountryName: null,
        // toCity
        //发件人城市
        fromCity: null,
        //发件人详细地址
        fromFirstAddress: null,
        //发件人邮编
        fromPostalCode: null,
        //地区ID
        fromProvinceId: null,
        //地区名字
        fromProvinceName: null,
        //发件人
        fromRecipient: null,
        //物流商ID
        logisticsId: null,
        // 物流商名称
        logisticsName: null,
        //预定义包裹
        parcel: null,
        parcelList: [],
        //备注
        remark: null,
        revision: 0,
        //签收选择
        sign: true,
        //客户编号
        tenantId: null,
        //公司名称
        toCompanyName: null,
        //收件人电话
        toContactPhone: null,
        //收件人国家ID
        toCountryId: null,
        //收件人国家名称
        toCountryName: null,
        //  fromCity
        //收件人城市
        toCity: null,
        //收件人详细地址
        toFirstAddress: null,
        //收件人邮编
        toPostalCode: null,
        //收件人地区ID
        toProvinceId: null,
        //收件人地区名称
        toProvinceName: null,
        //收件人
        toRecipient: null,
        warehouseId: null,
        warehouseName: null,
      },
      // 国家
      fromState: [],
      // 省市区
      fromProvince: [],
      // 国家
      toState: [],
      // 省市区
      toProvince: [],
      //仓库
      warehouse: [],

      //物流商
      logisticsArray: [],
      FromPostalCodeDataSource: [],
      toPostalCodeDataSource: [],
    };
  },
  methods: {
    //改变包裹
    changeParcel(record) {
      record.parcelNu = record.parcelNu == null ? 1 : record.parcelNu;
      if ((this.dto.logisticsName ?? "") != "") {
        if (this.dto.logisticsName.split("/")[1] == "anmei") {
          record.parcelNu = 1;
          this.$message.error("anmei物流商仅允许包裹数量为1！");
        }
      }
    },
    onChangeFromPostalCode(value) {
      this.dto.fromFirstAddress = value;
      this.dto.fromPostalCode = this.currentPostalCode;
    },
    // 发货邮箱带出地址
    onSearchFromPostalCode(value) {
      this.FromPostalCodeDataSource = [];
      if (value.length >= 5) {
        setTimeout(async () => {
          this.currentPostalCode = value;
          let { code, responseBody } = await postalCode(value);
          if (code == "200") {
            responseBody.forEach((item) => {
              this.FromPostalCodeDataSource.push(item.fromFirstAddress);
            });
            this.FromPostalCodeDataSource = [
              ...new Set(this.FromPostalCodeDataSource),
            ];
          }
        }, 100);
      }
    },
    onChangetoPostalCode(value) {
      this.dto.toFirstAddress = value;
      this.dto.toPostalCode = this.currentToPostalCode;
    },
    // 收获邮箱待地址
    onSearchtoPostalCode(value) {
      this.toPostalCodeDataSource = [];
      if (value.length >= 5) {
        setTimeout(async () => {
          this.currentToPostalCode = value;
          let { code, responseBody } = await postalCode(value);
          if (code == "200") {
            responseBody.forEach((item) => {
              this.toPostalCodeDataSource.push(item.toFirstAddress);
            });
            this.toPostalCodeDataSource = [
              ...new Set(this.toPostalCodeDataSource),
            ];
          }
        }, 100);
      }
    },
    //删除表格行
    delRowData(record) {
      this.dto.parcelList.forEach((item, i) => {
        if (item.key === record.key) {
          this.dto.parcelList.splice(i, 1);
        }
      });
    },
    //新增包裹信息
    addParcel() {
      let obj = {
        //高
        heightNumber: 1,
        //长
        lengthNumber: 1,
        // lengthType: 0,
        // lengthUnit: null,
        //包裹数量
        parcelNu: 1,
        //备注
        remark: null,
        //重量
        weightNumber: 1,
        //宽
        widthNumber: 1,
      };
      obj.key = Math.random();

      this.dto.parcelList.push(obj);
    },
    //创建订单
    showModal() {
      if (this.$refs.ruleForm) {
        this.$refs.ruleForm.resetFields();
      }
      this.dto = {
        //发件公司名称
        fromCompanyName: null,
        //发件人联系电话
        fromContactPhone: null,
        //国家ID
        fromCountryId: null,
        //国家名称
        fromCountryName: null,
        // fromEmail: null,
        //详细地址
        fromFirstAddress: null,
        //发件人邮编
        fromPostalCode: null,
        //地区ID
        fromProvinceId: null,
        //地区名字
        fromProvinceName: null,
        //发件人
        fromRecipient: null,
        //物流商ID
        logisticsId: null,
        // 物流商名称
        logisticsName: null,
        //预定义包裹
        parcel: null,
        parcelList: [],
        //备注
        remark: null,
        revision: 0,
        //签收选择
        sign: true,
        //客户编号
        tenantId: null,
        //公司名称
        toCompanyName: null,
        //收件人电话
        toContactPhone: null,
        //收件人国家ID
        toCountryId: null,
        //收件人国家名称
        toCountryName: null,
        // toEmail: null,
        //收件人城市
        toFirstAddress: null,
        //收件人详细地址
        toSecondAddress: null,
        //收件人邮编
        toPostalCode: null,
        //收件人地区ID
        toProvinceId: null,
        //收件人地区名称
        toProvinceName: null,
        //收件人
        toRecipient: null,
        warehouseId: null,
        warehouseName: null,
      };
      this.visible = true;
      this.getState();
      this.getLogisticsList();
      this.modalFlag = "add";
    },
    //提交模态框
    onSumit() {
      this.loading = true;
      let submitObj = { ...this.dto };
      submitObj.sign = this.dto.sign ? "1" : "0";
      this.$refs.ruleForm.validate((valid) => {
        if (valid) {
          if (submitObj.parcelList.length <= 0) {
            this.$message.error("请完善包裹信息！");
            this.loading = false;
            return false;
          }
          if (this.modalFlag === "add") {
            setTimeout(async () => {
              let { code, message } = await add_waybill(submitObj);
              if (code === "10000") {
                this.loading = false;
                this.visible = false;
                this.getTableList();
              } else {
                this.loading = false;
                this.$message.error(message);
              }
            }, 1000);
          } else if (this.modalFlag === "edit") {
            setTimeout(async () => {
              let { code, message } = await put_waybill(submitObj);
              if (code === "10000") {
                this.loading = false;
                this.visible = false;
                this.getTableList();
              } else {
                this.loading = false;
                this.$message.error(message);
              }
            }, 1000);
          }
        } else {
          this.$message.error("请检查必填项！");
          this.loading = false;
          return false;
        }
      });
    },
    // 物流商更改
    async handleChangeLogistics(value, option) {
      if (option.data.attrs.logisticsPlatform == "anmei") {
        this.parcelFlag = true;
        this.dto.parcelList.forEach((v) => {
          if (v.parcelNu > 1) {
            this.parcelFlag = false;
          }
        });
        if (!this.parcelFlag) {
          this.$message.error("anmei物流商仅允许包裹数量为1！");
          this.dto.logisticsName = null;
          return false;
        }
      }
      this.dto.logisticsName =
        option.data.attrs.serviceName +
        "/" +
        option.data.attrs.logisticsPlatform;
      this.dto.logisticsId =
        option.data.attrs.sysLogisticsId +
        "," +
        option.data.attrs.sysLogisticsServiceItemId;
    },
    //获取国家接口
    async getState() {
      let { code, responseBody } = await Outbound_state();
      if (code === "200") {
        this.fromState = responseBody;
        this.toState = responseBody;
      }
    },
    // 发件国家下拉
    async handleChangeState(value, option) {
      this.dto.fromCountryName = option.data.attrs.name;
      this.dto.fromCountryId = value;
      this.dto.fromProvinceName = undefined;
      this.dto.fromProvinceId = undefined;
      let { code, responseBody } = await Outbound_Province(value);
      if (code === "200") {
        this.fromProvince = responseBody;
      }
    },
    // 收件国家下拉
    async handleToChangeState(value, option) {
      this.dto.toCountryName = option.data.attrs.name;
      this.dto.toCountryId = value;
      this.dto.toProvinceName = undefined;
      this.dto.toProvinceId = undefined;
      let { code, responseBody } = await Outbound_Province(value);
      if (code === "200") {
        this.toProvince = responseBody;
      }
    },
    // 发件人地区更改
    handleChangeProvince(value, option) {
      this.dto.fromProvinceName = option.data.attrs.name;
      this.dto.fromProvinceId = value;
      // this.OutboundModalData.provinceId = value * 1;
    },
    // 收件人地区更改
    handleChangeToProvince(value, option) {
      this.dto.toProvinceName = option.data.attrs.name;
      this.dto.toProvinceId = value;
      // this.OutboundModalData.provinceId = value * 1;
    },
    filterOption(input, option) {
      return (
        option.componentOptions.children[0].text
          .toLowerCase()
          .indexOf(input.toLowerCase()) >= 0
      );
    },
    async getLogisticsList() {
      let logisticsList = await Outbounddel_carrier();
      if (logisticsList.code === "200") {
        this.logisticsList = logisticsList.responseBody;
      }
    },
    async changeTenantId(value) {
      if (this.port != "client") {
        this.getWhListData(value);
      }
      this.dto.logisticsName = null;
      this.dto.logisticsId = null;
      this.dto.warehouseId = null;
      this.dto.warehouseName = null;
      let res = await tenantService(value);
      if (res.code === "200") {
        this.logisticsArray = res.responseBody;
      }
    },
    //仓库更改
    handleChangeWarehouse(value, option) {
      this.dto.warehouseName = option.data.attrs.name;
      this.dto.warehouseId = value;
    },
    //根据客户编号获取仓库
    async getWhListData(tenantId) {
      let { code, responseBody } = await getWhList(tenantId);
      if (code === "200") {
        this.warehouse = responseBody.filter((item) => {
          return item.warehouseId != null;
        });
      }
    },
  },
  computed: {
    // ...mapState(["logisticsArray"]),
    columns() {
      return [
        {
          title: "包裹数量",
          dataIndex: "parcelNu",
          align: "center",
          scopedSlots: { customRender: "parcelNu" },
          width: "10%",

          //  fixed: "left",
        },
        {
          title: "长*宽*高(cm)",
          dataIndex: "lengthNumber",
          scopedSlots: { customRender: "lengthNumber" },
          align: "center",
          width: "50%",
        },
        {
          title: "重量(kg)",
          dataIndex: "weightNumber",
          align: "center",
          scopedSlots: { customRender: "weightNumber" },
          width: "10%",
        },
        {
          title: "备注",
          dataIndex: "remark",
          scopedSlots: { customRender: "remark" },
          align: "center",
          width: "20%",
        },
        {
          title: "操作",
          dataIndex: "action",
          scopedSlots: { customRender: "action" },
          align: "center",
          width: "10%",
        },
      ];
    },
    //   表单验证规则
    rules() {
      if (this.port === "client") {
        return {
          fromRecipient: [
            {
              required: true,
              message: "发件人姓名为必填项",
              trigger: "blur",
            },
            {
              min: 3,
              message: "发件人姓名最少为3位！",
              trigger: "blur",
            },
          ],
          fromContactPhone: [
            {
              required: true,
              message: "发件人电话号码为必填项",
              trigger: "blur",
            },
            {
              min: 10,
              max: 20,
              message: "长度限制为10-20位",
              trigger: "blur",
            },
          ],
          fromCountryId: [
            {
              required: true,
              message: "请选择发件国家！",
              trigger: "blur",
            },
          ],

          fromProvinceId: [
            {
              required: true,
              message: "请选择发件州/市！",
              trigger: "blur",
            },
          ],
          fromCity: [
            {
              required: true,
              message: "请输入发件人城市！",
              trigger: "blur",
            },
            {
              min: 3,
              max: 100,
              message: "长度限制为3-100位",
              trigger: "blur",
            },
          ],
          fromFirstAddress: [
            {
              required: true,
              message: "请输入发件人详细地址！",
              trigger: "blur",
            },
          ],
          fromPostalCode: [
            {
              required: true,
              message: "请选择发件邮编！",
              trigger: "blur",
            },
          ],
          toRecipient: [
            {
              required: true,
              message: "请输入收件人姓名！",
              trigger: "blur",
            },
            {
              min: 3,
              message: "收件人姓名最少为3位！",
              trigger: "blur",
            },
          ],
          toContactPhone: [
            {
              required: true,
              message: "请输入收件人电话号码！",
              trigger: "blur",
            },
            {
              min: 10,
              max: 20,
              message: "长度限制为10-20位",
              trigger: "blur",
            },
          ],
          toCountryId: [
            {
              required: true,
              message: "请选择收件人国家！",
              trigger: "blur",
            },
          ],
          toProvinceId: [
            {
              required: true,
              message: "请选择收件人州/市！",
              trigger: "blur",
            },
          ],
          toPostalCode: [
            {
              required: true,
              message: "请输入收件人邮编！",
              trigger: "blur",
            },
          ],
          toCity: [
            {
              required: true,
              message: "请输入收件人城市名！",
              trigger: "blur",
            },
            {
              min: 3,
              max: 100,
              message: "长度限制为3-100位",
              trigger: "blur",
            },
          ],
          toFirstAddress: [
            {
              required: true,
              message: "请输入收件人详细地址！",
              trigger: "blur",
            },
          ],
          // type: [
          //   {
          //     required: true,
          //     message: "请选择物流商！",
          //     trigger: "change",
          //   },
          // ],
          warehouseId: [
            {
              required: true,
              message: "请选择仓库！",
              trigger: "blur",
            },
          ],
        };
      } else {
        return {
          // type: [
          //   {
          //     required: true,
          //     message: "请选择物流商！",
          //     trigger: "change",
          //   },
          // ],
          tenantId: [
            {
              required: true,
              message: "客户编号为必填项",
              trigger: "blur",
            },
          ],
          fromRecipient: [
            {
              required: true,
              message: "发件人姓名为必填项",
              trigger: "blur",
            },
            {
              min: 3,
              message: "发件人姓名最少为3位！",
              trigger: "blur",
            },
          ],
          fromContactPhone: [
            {
              required: true,
              message: "发件人电话号码为必填项",
              trigger: "blur",
            },
            {
              min: 10,
              max: 20,
              message: "长度限制为10-20位",
              trigger: "blur",
            },
          ],
          fromCountryId: [
            {
              required: true,
              message: "请选择发件国家！",
              trigger: "blur",
            },
          ],
          fromProvinceId: [
            {
              required: true,
              message: "请选择发件州/市！",
              trigger: "blur",
            },
          ],
          fromCity: [
            {
              required: true,
              message: "请输入发件人城市！",
              trigger: "blur",
            },
            {
              min: 3,
              max: 100,
              message: "长度限制为3-100位",
              trigger: "blur",
            },
          ],
          fromFirstAddress: [
            {
              required: true,
              message: "请输入发件人详细地址！",
              trigger: "blur",
            },
          ],
          fromPostalCode: [
            {
              required: true,
              message: "请选择发件邮编！",
              trigger: "blur",
            },
          ],
          toRecipient: [
            {
              required: true,
              message: "请输入收件人姓名！",
              trigger: "blur",
            },
            {
              min: 3,
              message: "收件人姓名最少为3位！",
              trigger: "blur",
            },
          ],
          toContactPhone: [
            {
              required: true,
              message: "请输入收件人电话号码！",
              trigger: "blur",
            },
            {
              min: 10,
              max: 20,
              message: "长度限制为10-20位",
              trigger: "blur",
            },
          ],
          toCountryId: [
            {
              required: true,
              message: "请选择收件人国家！",
              trigger: "blur",
            },
          ],
          toProvinceId: [
            {
              required: true,
              message: "请选择收件人州/市！",
              trigger: "blur",
            },
          ],
          toPostalCode: [
            {
              required: true,
              message: "请输入收件人邮编！",
              trigger: "blur",
            },
          ],
          toCity: [
            {
              required: true,
              message: "请输入收件人城市名！",
              trigger: "blur",
            },
            {
              min: 3,
              max: 100,
              message: "长度限制为3-100位",
              trigger: "blur",
            },
          ],
          toFirstAddress: [
            {
              required: true,
              message: "请输入收件人详细地址！",
              trigger: "blur",
            },
          ],
          warehouseId: [
            {
              required: true,
              message: "请选择仓库！",
              trigger: "blur",
            },
          ],
        };
      }
    },
  },
};
</script>

<style lang="less" scoped>
/deep/.ant-modal-footer {
  text-align: center !important;
  button {
    margin: 0 50px;
  }
}
/deep/.ant-form-item {
  margin-bottom: 12px;
}
.logisticsCard {
  /deep/.ant-card-body {
    padding: 0;
  }
}
</style>